<!DOCTYPE HTML>

<html>
    <head>
        <title>Projet ALOS</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <link href="http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600" rel="stylesheet" type="text/css" />
        <script src="js/jquery.min.js"></script>
        <script src="js/skel.min.js"></script>
        <script src="js/skel-panels.min.js"></script>
        <script src="js/init.js"></script>
        <script src="js/fonctions.js"></script>
        <noscript>
        <link rel="stylesheet" href="css/skel-noscript.css" />
        <link rel="stylesheet" href="css/style.css" />
        <link rel="stylesheet" href="css/style-wide.css" />
        </noscript>
    </head>
    <body>  
        <!-- Header -->
        <div id="header" class="skel-panels-fixed">
            <div class="top">       
                <!-- En haut à gauche -->
                <div id="logo">
                    <h1 id="title">David Lapierre & Valentin Letertre</h1>
                    <span class="byline">Projet ALOS</span>
                </div>  
                    
                <!-- Menu -->
                <nav id="nav">
                    <ul>
                        <li><a href="#deposer" id="top-link" class="skel-panels-ignoreHref"><span class="icon icon-chevron-right">Déposer XML</span></a></li>
                        <li><a href="#rechercher" id="portfolio-link" class="skel-panels-ignoreHref"><span class="icon icon-chevron-right">Rechercher XML</span></a></li>
                        <li><a href="#retourner" id="about-link" class="skel-panels-ignoreHref"><span class="icon icon-chevron-right">Retourner XML</span></a></li>
                        <li><a href="#generer" id="contact-link" class="skel-panels-ignoreHref"><span class="icon icon-chevron-right">Générer PDF</span></a></li>
                    </ul>
                </nav>                                  
            </div>
        </div>
            
        <!-- Zone principale -->
        <div id="main">
            <!-- Déposer XML -->
            <section id="deposer" class="one">
                <div class="container">
                    <header>
                        <h2 class="alt">Déposer un XML</h2>
                    </header>
                        
                    <p>Cette partie va vous permettre de déposer un XML sur le serveur. Il sera
                    vérifié par notre schéma XSD.</p>
                            
                    <form method="POST" action="upload" enctype="multipart/form-data" >
                        Fichier : 
                        <input type="file" name="file" id="file" /> <br/>
                        <input type="submit" value="Déposer" name="upload" id="upload" />
                    </form>
                </div>
            </section>
                
            <!-- Rechercher XML -->
            <section id="rechercher" class="two">
                <div class="container">
                    <header>
                        <h2>Rechercher un XML</h2>
                    </header>
                        
                    <p>Cette partie va vous permettre de rechercher un XML sur le serveur.</p>
                        
                    <form method="POST" action="rechercherXML">
                        Type de recherche :
                        <input type="radio" id="et" name="typeRecherche" value="et" checked>ET
                        <input type="radio" name="typeRecherche" value="ou">OU<br>
                            
                        Mot-clé : <input type="text" name="motcle" id="motcle">
                        <input type="button" value=">>" onclick="ajouterMC()">
                        <div id="motscles"></div>
                            
                        <!-- Balise "hidden" qui permet de récupérer la tableau des mots clés -->
                        <input type="hidden" id="v_tableauMotCle" name="v_tableauMotCle" value=""/>
                        <input type="hidden" id="v_typeRecherche" name="v_typeRecherche" value=""/>
                        <input type="submit" value="Rechercher" name="rechercher" id="rechercher" onclick="changerTypeRecherche()"/>
                    </form>
                </div>
            </section>
                
            <!-- Retourner XML -->
            <section id="retourner" class="three">
                <div class="container">
                    <header>
                        <h2>Retourner XML</h2>
                    </header>
                        
                    <p>Cette partie va vous permettre de retourner un XML du serveur à partir de son identifiant.</p>
                        
                    <form method="POST" action="retournerXML">
                        Identifiant : <input type="text" name="identifiantRetourner" id="identifiantRetourner">
                        <input type="submit" value="Retourner" name="retourner" id="retourner" />
                    </form>
                </div>
            </section>
                
            <!-- Générer PDF -->
            <section id="generer" class="four">
                <div class="container">
                    <header>
                        <h2>Générer PDF</h2>
                    </header>
                        
                    <p>Cette partie va vous permettre de générer un PDF à partir d'un identifiant d'un XML présent sur le serveur.</p>
                        
                    <form method="POST" action="genererPDF">
                        Identifiant : <input type="text" name="identifiantGenerer" id="identifiantGenerer">
                        <input type="submit" value="Générer" name="generer" id="generer" />
                    </form> 
                </div>
            </section>
        </div>
            
        <!-- Footer -->
        <div id="footer">
            <!-- Copyright -->
            <div class="copyright">
                <p>Master ICONE 2 ISI</p>
                <ul class="menu">
                    <li>Projet de synthèse</li>
                    <li>ALOS</li>
                </ul>
            </div>
        </div>
    </body>
</html>